<template>
  <!-- 报名须知 -->
  <div class="notesappli" id="notesappli">
    <heads></heads>
    <div class="notesappli_cont">
  
      <div class="academicdetailCont_body">
        <div class="academicdetailCont_body_conta">
          <div class="academicdetailCont_body_conta_tit"></div>
          <p>
            1.
            正式开课前24小时，我们会以短信通知或邮件通知的形式，提醒学员按时进入直播间听课。
          </p>
          <p>
            2. 操作指南详见下方视频指导（按视频中的<span style="color: #ff7301"
              >红色字幕</span
            >说明操作）
          </p>
          <p>
            3.
            如果您浏览器不支持网页直播，请使用Chrome58（谷歌浏览器）以上版本的浏览器直播。<span
              class="browser"
              ><a
               @click="toWebView"
                target="_blank"
                style="color: #fff; font-size: 15px"
                >下载Chorme浏览器</a
              ></span
            >
          </p>
          <!-- <p style="display:inline-block;color:#fff;font-size:15px;text-align:center;background:#003c80;width:156px;height:37px;line-height:37px;border-radius:28px;text-indent:0"><a href="https://www.google.cn/chrome/" target="_blank" style="color:#fff;font-size:15px;">下载Chorme浏览器</a></p> -->
        </div>
        <div class="academicdetailCont_body_contb">
          <div class="academicdetailCont_body_contb_tit"></div>
          <div class="academicdetailCont_body_contb_img">
            <video
              src="https://journal-alliance.oss-cn-beijing.aliyuncs.com/help/%E5%8C%BB%E8%8D%AF%E6%9C%9F%E5%88%8A%E8%81%94%E7%9B%9F%E6%8C%87%E5%AF%BC.mp4"
              ref="video"
              controls
            ></video>
          </div>
          <p class="academicdetailCont_body_contb_info">详情请看操作演示</p>
          <div class="academicdetailCont_body_contb_bto"></div>
        </div>
        <div class="academicdetailCont_body_contc">
          <div class="academicdetailCont_body_contc_tit"></div>
          <p>
            1.系列课程中每个主题授课时间为1小时，原则上老师讲授时间为45分钟，统一答疑时间为15分钟（可能会根据课程内容稍作调整）。
          </p>
          <p>
            2.为保证授课质量和课程连贯性，听课过程中暂不支持学生与老师连麦，如学生有问题，可以通过文字形式将问题输入在聊天框内，随班助教会统一将问题整理反馈给老师，并由老师在答疑时间内统一回答。
          </p>
          <p>3.课程结束后，如学生还有问题，可以将问题反馈给随班助教。</p>
        </div>
      </div>
    </div>
  </div>
</template>

<script>
export default {
  data() {
    return {
      videopath:
        "https://journal-alliance.oss-cn-beijing.aliyuncs.com/help/%E5%BD%95%E6%92%AD_1.mp4",
    };
  },
  methods: {
  
    baonin() {
      this.$uniRouter.push({
        path: "/pages/streaming/main",
      });
    },
    toWebView(){
        this.$uniRouter.push({
            path:'/pages/webView/main',
            query:{
                url:'https://www.google.cn/chrome/'
            }
        })
    }
  },
  mounted() {
    // this.$refs.video.src = this.videopath
  },
  created() {},
};
</script>

<style lang="less" scoped>
.browser {
  display: inline-block;
  color: #fff;
  font-size: 30rpx;
  text-align: center;
  background: #003c80;
  width: 312rpx;
  height: 74rpx;
  line-height: 74rpx;
  border-radius: 56rpx;
  text-indent: 0;
  margin-left: 26rpx;
}

#notesappli {
  width: 100%;
  // height: 100%;
  .notesappli_cont {
    width: 100%;
    // height: 100%;
    .academicdetailCont_crumbs {
      width: 2280rpx;
      height: 40rpx;
      margin: 0 auto;
      position: relative;
      text-align: left;
      line-height: 40rpx;
      padding-left: 20rpx;
      span:nth-child(1) a,
      span:nth-child(3) a {
        color: #000000;
        font-size: 32rpx;
        font-weight: bold;
        cursor: pointer;
      }
      i {
        color: #767c82;
        font-size: 36rpx;
        margin-left: 20rpx;
        font-weight: bold;
      }
      span:nth-child(3) {
        color: #ff7301;
        font-size: 32rpx;
        margin-left: 20rpx;
        font-weight: bold;
        cursor: pointer;
      }
    }
    .academicdetailCont_body {
      width: 2280rpx;
      margin: 0 auto;
      position: relative;
      background: url("https://uniappfile.bosihw.cn/Res/BosihuiwenRes/yyqklm/zb/11.png") no-repeat;
      background-size: cover;
      padding: 44rpx 32rpx;
      padding-bottom: 124rpx;
      .academicdetailCont_body_conta {
        width: 2020rpx;
        height: auto;
        border: 2rpx solid #8da4bf;
        border-radius: 20rpx;
        background: #fff;
        margin: 0 auto;
        margin-top:114rpx;
        position: relative;
        .academicdetailCont_body_conta_tit {
          width: 642rpx;
          height: 184rpx;
          background: url("https://uniappfile.bosihw.cn/Res/BosihuiwenRes/yyqklm/zb/tkxz.png") no-repeat;
          background-size: cover;
          position: relative;
          left: -84rpx;
          top: -74rpx;
        }
        p {
          color: #70728b;
          font-size: 34rpx;
          text-indent: 2em;
          text-align: justify;
          width: 93%;
          line-height: 62rpx;
          margin: 0 auto;
          position: relative;
          top: -40rpx;
        }
      }
      .academicdetailCont_body_contb {
        width: 2020rpx;
        height: auto;
        border: 2rpx solid #8da4bf;
        border-radius: 2rpx;
        background: #fff;
        margin: 0 auto;
        margin-top: 238rpx;
        position: relative;
        .academicdetailCont_body_contb_tit {
          width: 652rpx;
          height: 184rpx;
          background: url("https://uniappfile.bosihw.cn/Res/BosihuiwenRes/yyqklm/zb/spzd.png") no-repeat;
          background-size: cover;
          position: relative;
          right: -72%;
          top: -66rpx;
        }
        .academicdetailCont_body_contb_img {
          width: 1804rpx;
          height: 1012rpx;
          margin: 0 auto;
          position: relative;
          top: 0px;
          z-index: 999;
          video {
            display: inline-block;
            width: 100%;
            height: 100%;
            position: absolute;
            top: 0;
            left: 0;
          }
          img {
            display: inline-block;
            width: 100%;
            height: 100%;
            position: absolute;
            left: 0;
            top: 0;
          }
        }
        .academicdetailCont_body_contb_info {
          color: #70728b;
          font-size: 34rpx;
          margin-left: 112rpx;
          margin-top: 38rpx;
        }
        .academicdetailCont_body_contb_bto {
          width: 696rpx;
          height: 106rpx;
          background: url("https://uniappfile.bosihw.cn/Res/BosihuiwenRes/yyqklm/zb/zs.png") no-repeat;
          background-size: cover;
          position: relative;
          right: -65%;
        }
      }
      .academicdetailCont_body_contc {
        width: 2020rpx;
        height: auto;
        border: 2rpx solid #8da4bf;
        border-radius: 20rpx;
        background: #fff;
        margin: 0 auto;
        margin-top: 138rpx;
        position: relative;
        .academicdetailCont_body_contc_tit {
          width: 508rpx;
          height: 182rpx;
          background: url("https://uniappfile.bosihw.cn/Res/BosihuiwenRes/yyqklm/zb/kzxz.png") no-repeat;
          background-size: cover;
          position: relative;
          left: -120rpx;
          top: -60rpx;
        }
        p {
          color: #70728b;
          font-size: 34rpx;
          text-indent: 2em;
          text-align: justify;
          width: 93%;
          line-height: 62rpx;
          margin: 0 auto;
          position: relative;
          top: -24rpx;
          margin-bottom: 20rpx;
        }
        .academicdetailCont_body_contc_mainA {
          margin-left: 40rpx;
          float: left;
          width: 960rpx;
        }
      }
      .subtn {
        width: 240rpx;
        height: 70rpx;
        background: #003c80;
        border-radius: 40rpx;
        margin: 0 auto;
        line-height: 76rpx;
        text-align: center;
        font-size: 32rpx;
        color: #fff;
        cursor: pointer;
      }
    }
  }
}
@media screen and (max-width: 1010px) {
  .notesappli_cont {
    width: 100% !important;
    .academicdetailCont_crumbs {
      display: none;
    }
    .academicdetailCont_body {
      width: 100% !important;
      box-sizing: border-box;
      .academicdetailCont_body_conta {
        width: 100% !important;
        height: auto !important;
        margin-top: 28rpx !important;
        .academicdetailCont_body_conta_tit {
          width: 480rpx !important;
          height: 134rpx !important;
          left: -30rpx !important;
          top: -58rpx !important;
        }
      }
      .academicdetailCont_body_contb {
        width: 100% !important;
        height: auto !important;
        margin-top: 86rpx !important;
        .academicdetailCont_body_contb_tit {
          width: 450rpx !important;
          right: -212rpx !important;
          height: 134rpx !important;
          width: 484rpx !important;
          top: -62rpx !important;
        }
        .academicdetailCont_body_contb_img {
          width: 100% !important;
          height:386rpx !important;
        }
        .academicdetailCont_body_contb_info {
          margin-top: 14rpx !important;
          margin-bottom: 44rpx !important;
        }
        .academicdetailCont_body_contb_bto {
          width: 392rpx !important;
          height: 68rpx !important;
          right: -242rpx !important;
        }
      }
      .academicdetailCont_body_contc {
        width: 100% !important;
        height: auto !important;
        margin-top: 86rpx !important;
        .academicdetailCont_body_contc_tit {
          width: 480rpx !important;
          height: 134rpx !important;
          left: -66rpx !important;
          top: -58rpx !important;
        }
        .academicdetailCont_body_contc_ma_top {
          height: 2022rpx !important;
          .academicdetailCont_body_contc_mainA {
            width: 85% !important;
            margin: 0 auto;
            display: block !important;
            float: none !important;
            margin-left: 1 !important;
          }
        }
        .academicdetailCont_body_contc_ma_bto {
          height: 4042rpx !important;
          .academicdetailCont_body_contc_mainA {
            width: 85% !important;
            margin: 0 auto;
            display: block !important;
            float: none !important;
            margin-left: 1 !important;
          }
        }
        .subtn {
          margin-bottom: 76rpx !important;
        }
      }
    }
  }
}
</style>